<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>辅导答疑平台-首页</title>
    <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet" href="/css/bootstrap3.css">
    <link rel="stylesheet" href="/css/font-awesome.min.css">
    <link rel="stylesheet" href="/css/common.css">
    <script src="/js/jquery.min.js"></script>
    <script src="/js/popper.min.js"></script>
    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"
            integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous">
    </script>
    <style>
        .question-disc {
            font-size: 12px;
            color: #999;
            font-weight: normal;
        }

        .question-rank {
            width: 18px;
            padding-right: 3px;
        }
    </style>
</head>

<body style="background-color: #efefef;">
<div th:insert="template::header"></div>
<div class="container-fluid bg-secondary">
    <div class="row">
        <div class="col-sm-12">
            <div class="col-lg-9 col-md-12 col-sm-12 col-xs-12" style="background-color: white;">
                <h3>
                    <i class="fa fa-book fa"></i>
                    <span>常见问题库</span>
                </h3>

            </div>
            <div class="col-lg-3 col-md-12 col-sm-12 col-xs-12 bg-info">
                <h3>
                    <i class="fa fa-paper-plane-o"></i>
                    <span>热门问题</span>
                </h3>
                <ul class="list-group">
                    <li class="list-group-item"><img class="question-rank" src="/img/icon-1.png">Cras justo odio</li>
                    <li class="list-group-item"><img class="question-rank" src="/img/icon-2.png">Dapibus ac facilisis in
                    </li>
                    <li class="list-group-item"><img class="question-rank" src="/img/icon-3.png">Morbi leo risus</li>
                    <li class="list-group-item"><img class="question-rank" src="/img/icon-4.png">Porta ac consectetur ac
                    </li>
                    <li class="list-group-item"><img class="question-rank" src="/img/icon-5.png">Vestibulum at eros</li>
                </ul>
            </div>
        </div>

    </div>
</div>
<div th:insert="template::footer"></div>
</body>

</html>